<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>07_Web Workers_测试</title>
</head>
<body>
<!--
 Web Workers是HTNL5提供的一个JavaScript多线程解决方案
 我们可以将一些大计算量的代码交由Web Workers运行，不冻结用户界面
 但是子线程完全受主线程控制，且不能操作dom
 所以，这个新标准并没有改变JavaScript单线程的本质

1. H5规范提供了js分线程的实现, 取名为: Web Workers
2. 相关API
  * Worker: 构造函数, 加载分线程执行的js文件
  * Worker.prototype.onmessage: 用于接收另一个线程的回调函数
  * Worker.prototype.postMessage: 向另一个线程发送消息
3. 不足
  * worker内代码不能操作DOM(更新UI)
  * 不能跨域加载JS
  * 不是每个浏览器都支持这个新特性
-->
<input type="text" placeholder="数值" id="num">
	<input type="button" value="计算" id="btn">
	<script>
		//1 1 2 3 5 8 ...   f(n)=f(n-1)+f(n-2)
		function fibonacci(n) {
			return n<=2?1:fibonacci(n-1)+fibonacci(n-2)//递归调用
		}
		// console.log(fibonacci(6));
		var input=document.getElementById('num')
		var btn=document.getElementById('btn')
		btn.addEventListener('click',function () {
			var number=input.value
			var res=fibonacci(number)//数值越大浏览器花费的时间越长，即冻结用户界面
			alert(res)
		})
	</script>
</body>
</html>